Multi-Resolution Image Sets
on Android Platforms

This topic is only relevant to Android Platforms.

 

Android devices come in a wide variety of different screen pixel densities, which for simplicity are divided, by Android, into six generalised densities: low, medium, high, extra-high, extra-extra-high and extra-extra-extra-high. The same image displayed on two different devices would look smaller on a device with a higher density screen than on one with a lower density screen.

In order to avoid this discrepancy and provide similar-looking displays across different screen densities, the Android operating system allows items, such as images, to be sized in so-called 'density-independent pixels' rather than physical pixels. The operating system then automatically handles the conversion of density-independent pixels to physical pixels at runtime and scales items up or down as appropriate, so that the same image displayed on two different devices with differing screen densities will be of a relatively similar size on the two devices rather than appearing smaller on the higher density device.

However, scaling images and other elements can result in them becoming blurred or pixelated, which could result in screen displays which are not always crisp and clear.

Therefore, if you are creating an app which could be run on devices with different screen densities, the best solution is to provide differently sized versions of each individual image, so that an appropriately sized image is available at runtime for all devices your app might run on.

To make this easier for you, Digitise Apps includes a facility to simplify providing a set of different sized versions of the same image from which the Digitise Apps Client can automatically choose the appropriate one at runtime.

You can use this facility with:

• Picture & Video Controls.

• App icons on the standard Digitise Apps Client's Home screen.

• Data Conversion.

• the SetControlImage Scripting Method used to display an image file in a Picture & Video Control.

 

To use this facility, you first need to create copies of an image at the required sizes (see below) for each of the screen resolutions you want to support. Choose a base file name for this image and save each version of your image to a different file, using the file name format:

<basefilename>@<screendensity>.<fileextension>

where : <fileextension> should be the standard file extension for the file format used,

and @<screendensity> should be one of the following values to indicate the screen density the image is intended for:

 

You can also create a default image called just <basefilename>.<fileextension>, i.e. without the @<screendensity> suffix added. This file will be used where the device has a screen resolution which isn't covered by any of the other supplied images.

 

The Medium-density acts as the baseline for sizing your images. On a device with a medium-density display, an image which has the same pixel size as the Picture & Video Control which contains it, will fill the control without the need to scale up or down.

The following table lists the scaling factor you should apply, relative to medium-density, to the size (in physical pixels) for the different file sizes in the previous table:

 

Having created your set of images you can import them into the Resources Pane in the usual way. You will then need to edit each resource Identifier name within the Resources Pane to remove the number, such as '_1', which will have been appended to each one as it was imported.

When you want to use the image file within your app, you simply specify the base file name as it appears within the Resources Pane without any suffix.

For example, if you created MyPic.bmp, MyPic@LOW.bmp and MyPic@HIGH.png when you import them into the Resource Pane they will initially appear in the tree view with the following Identifiers: ID_IMAGE_MYPIC_1, ID_IMAGE_MYPIC@LOW_1 and ID_IMAGE_MYPIC@HIGH_1. You then need to edit the Identifier names to remove the '_1' at the end of each one. Now suppose you want to assign this picture to a Picture & Video Control on a form, within the Properties for the Control, in the Bitmap Property you would simply specify ID_IMAGE_MYPIC. At runtime on a device with a 120dpi screen the Digitise Apps Client will automatically use the @LOW version of the file, on a 240dpi screen it would use the @HIGH version and on a 320 dpi screen it would use the default ID_IMAGE_MYPIC version.

To use these files to provide an icon for the app on the standard Digitise Apps Client's Home screen, you would enter ID_IMAGE_MYPIC in the Bitmap Property in the Project Properties.